<!DOCTYPE html>
<html lang="zh">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>
        <%=title%>
    </title>
    <link rel="stylesheet" href="/css/base.css">
    <link rel="icon" type="image/ico" href="/favicon.ico">
    <!--导入样式文件 -->
    <link rel="stylesheet" href="/element-plus/dist/index.css" />

</head>

<body>
    <div id="app" v-cloak>
        <div class="common-layout">
            <el-container>
                <el-header style="background-color: #409EFF;">Header</el-header>
                <el-container>
                    <el-aside style="background-color: #67C23A; width: 200px; height: 1000px;">Aside</el-aside>
                    <el-main style="background-color: #F56C6C; height: 1000px;">Main</el-main>
                </el-container>
            </el-container>
        </div>
    </div>
</body>

</html>
<!-- 导入 Vue 3 -->
<script src="/vue/dist/vue.global.js"></script>
<!-- 导入 组件库 -->
<script src="/element-plus/dist/index.full.js"></script>
<!-- 导入 图标库 -->
<script src="/@element-plus/icons-vue/dist/index.iife.min.js"></script>
<!-- 导入axios -->
<script src="/axios/dist/axios.js"></script>
<script>
    // 导入函数 
    const { createApp } = Vue;
    // 创建vue3程序
    const app = createApp({
        // 初始化函数
        setup() {

        }
    })

    // 导入所有ElementPlus图标并进行全局注册
    for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
        app.component(key, component)
    }
    // 使用elementPlus组件库
    app.use(ElementPlus);

    // 挂载程序
    app.mount('#app');
</script>